{% extends 'base.html' %}
{% load static %}
{% load crispy_forms_tags %}
{% load crispy_forms_filters %}


{% block head %}
{% endblock %}

{% block title %}{% trans 'DebugExperiment' %}{% endblock %}

{% block body %}
    <div class="tw:container tw:mx-auto tw:p-6">
        <h1 class="tw:text-3xl tw:font-bold tw:mb-6">Researcher Management</h1>
        
        <!-- Tabs for different views -->
        <div class="tw:tabs tw:mb-6">
            <a class="tw:tab tw:tab-bordered">Researchers</a>
            <a class="tw:tab tw:tab-bordered tw:tab-active">Batch Upload</a>
        </div>
        
        <!-- Batch Upload Section -->
        <div class="tw:card tw:bg-base-100 tw:shadow-xl">
            <div class="tw:card-body">
                <h2 class="tw:card-title tw:mb-4">Batch Upload Resumes</h2>
                
                <!-- Upload Form -->
                <div class="tw:form-control tw:mb-4">
                    <div class="tw:label">
                        <span class="tw:label-text">Upload multiple resumes</span>
                    </div>
                    <div class="tw:border-2 tw:border-dashed tw:border-gray-300 tw:rounded-lg tw:p-8 tw:text-center tw:cursor-pointer hover:tw:bg-gray-50">
                        <div class="tw:flex tw:flex-col tw:items-center tw:justify-center">
                            <svg xmlns="http://www.w3.org/2000/svg" class="tw:h-12 tw:w-12 tw:text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12" />
                            </svg>
                            <p class="tw:mt-1 tw:text-sm tw:text-gray-600">Drag and drop files here, or click to select files</p>
                            <p class="tw:mt-1 tw:text-xs tw:text-gray-500">Supported formats: PDF, DOCX, DOC</p>
                        </div>
                        <input type="file" class="tw:hidden" multiple accept=".pdf,.docx,.doc" />
                    </div>
                </div>
                
                <!-- Uploaded Files Preview -->
                <div class="tw:mb-6">
                    <h3 class="tw:text-lg tw:font-semibold tw:mb-2">Uploaded Files (3)</h3>
                    <div class="tw:overflow-x-auto">
                        <table class="tw:table tw:w-full">
                            <thead>
                                <tr>
                                    <th>Filename</th>
                                    <th>Size</th>
                                    <th>Email (Detected)</th>
                                    <th>Assign to</th>
                                    <th>Actions</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>johndoe_resume.pdf</td>
                                    <td>2.3 MB</td>
                                    <td>john.doe@example.com</td>
                                    <td>
                                        <select class="tw:select tw:select-bordered tw:select-sm tw:w-full">
                                            <option>Create New Researcher</option>
                                            <option>John Doe (Existing)</option>
                                            <option>Jane Smith (Existing)</option>
                                        </select>
                                    </td>
                                    <td>
                                        <button class="tw:btn tw:btn-sm tw:btn-error tw:btn-outline">Remove</button>
                                    </td>
                                </tr>
                                <tr>
                                    <td>jane_smith_cv.docx</td>
                                    <td>1.7 MB</td>
                                    <td>jane.smith@example.com</td>
                                    <td>
                                        <select class="tw:select tw:select-bordered tw:select-sm tw:w-full">
                                            <option>Create New Researcher</option>
                                            <option selected>Jane Smith (Existing)</option>
                                            <option>John Doe (Existing)</option>
                                        </select>
                                    </td>
                                    <td>
                                        <button class="tw:btn tw:btn-sm tw:btn-error tw:btn-outline">Remove</button>
                                    </td>
                                </tr>
                                <tr>
                                    <td>alex_morgan_resume.pdf</td>
                                    <td>1.9 MB</td>
                                    <td>alex.morgan@example.com</td>
                                    <td>
                                        <select class="tw:select tw:select-bordered tw:select-sm tw:w-full">
                                            <option selected>Create New Researcher</option>
                                            <option>John Doe (Existing)</option>
                                            <option>Jane Smith (Existing)</option>
                                        </select>
                                    </td>
                                    <td>
                                        <button class="tw:btn tw:btn-sm tw:btn-error tw:btn-outline">Remove</button>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                
                <!-- Options Section -->
                <div class="tw:mb-6">
                    <h3 class="tw:text-lg tw:font-semibold tw:mb-2">Processing Options</h3>
                    <div class="tw:form-control">
                        <label class="tw:label tw:cursor-pointer">
                            <span class="tw:label-text">Extract researcher information from resumes</span> 
                            <input type="checkbox" checked class="tw:checkbox" />
                        </label>
                    </div>
                    <div class="tw:form-control">
                        <label class="tw:label tw:cursor-pointer">
                            <span class="tw:label-text">Create new researcher accounts from extracted emails</span> 
                            <input type="checkbox" checked class="tw:checkbox" />
                        </label>
                    </div>
                    <div class="tw:form-control">
                        <label class="tw:label tw:cursor-pointer">
                            <span class="tw:label-text">Send welcome emails to new researchers</span> 
                            <input type="checkbox" class="tw:checkbox" />
                        </label>
                    </div>
                </div>
                
                <!-- Action Buttons -->
                <div class="tw:flex tw:gap-2 tw:justify-end">
                    <button class="tw:btn tw:btn-outline">Cancel</button>
                    <button class="tw:btn tw:btn-primary">Process & Create Researchers</button>
                </div>
            </div>
        </div>
    </div>

{% endblock %}



